import { defineComponent, ref } from 'vue';
import request from '@/request';
import dayjs from 'dayjs';
import {Permission} from '@/views/controlPermission/indexT'
import {ACCOUNT_STATUS, DEL_FLAG} from '@/dictionaries'
export type Role = {
  code?: string,
  delFlag?: string,
  rId?: number,
  rName?: string,
  remark?: string,
  status?: string,
  createTime?: string,
  updateTime?: string,
  permissionList?:Array<Permission>
}

export default defineComponent({
  name: 'roleControl',
  data() {
    return {}
  },
  setup() {

    const btUpdate = ref(true);//修改按钮禁用状态
    const btDelete = ref(true);//删除按钮禁用状态
    const dialogVisible = ref(false);
    const updateDialogVisible = ref(false);//修改弹出框结束
    const deleteDialogVisible = ref(false);//删除弹出框
    const value = ref('')
    const rName = ref('')//接收输入框中的值
    const rId = ref('')
    const code = ref('')
    const remark = ref('')
    const createTime = ref('')
    const updateTime = ref('')
    const tableData = ref([]);//显示角色列表
    const status = ref('');
    const selection = ref([]);
    const addPrSelectValue = ref([])
    const updatePrSelectValue = ref([])
    const permissionList = ref([])
    const options = ref([
      {
        value: '所有',
        label: '所有',
      },
      {
        value: '正常',
        label: '正常',
      },
      {
        value: '停用',
        label: '停用',
      },
    ])
    //判断列表框是否选中
    const handleSelectionChange = (val) => {
      console.log('val=', val)
      if (val.length > 0) {
        btDelete.value = false;
      } else {
        btDelete.value = true;
      }
      if (val.length == 1) {
        btUpdate.value = false;
      } else {
        btUpdate.value = true;
      }
      selection.value = val;
    }
    //获取id值
    const saverName = ref('')
    const SaverId = ref('')
    const gainRid = () => {
      selection.value.forEach((x) => {
        saverName.value = x.rName
      })

      updateRoleMessage()
      // console.log('值=',selection.value)
      selection.value.forEach((v) => {
        SaverId.value = v.rId
      })
      updateDialogVisible.value = true;
    }


    //动态显示角色列表
    const fnRoleList = () => {
      request('/api/role/list', 'POST', {}).then(//method：请求的类型 submitData:
        (res) => {
          tableData.value = res.data;
          fnPower()
        },
      )
    }
    //删除角色
    const deleteRid = ref([])//要删除的角色id
    const fnRoleDelete = () => {
      selection.value.forEach(d => {
        deleteRid.value.push(d.rId)

      })
      request('/api/role/delete', 'DELETE', { roleId: deleteRid.value }).then(
        (res) => {
          deleteDialogVisible.value = false;
          fnRoleList()
        },
      )
    }
    //新增角色
    const fnRoleInsert = () => {
      const InsertDate = {
        code: code.value,
        delFlag: '',
        rId: '',
        rName: rName.value,
        remark: remark.value,
        status: '',
        createTime: '',
        updateTime: '',
      }

      request('/api/role/insert', 'PUT', InsertDate).then((res) => {
          dialogVisible.value = false;
          fnRoleList();
          remark.value = '';
          rName.value = '';
          code.value = '';
          value.value = ''
        },
      )

    }
    //修改角色
    const fnRoleUpdate = () => {
      const UpDate: Role = {
        code: code.value,
        createTime: '',
        delFlag: '',
        rId: SaverId.value ? parseInt(SaverId.value) : 0,
        rName: rName.value,
        remark: remark.value,
        status: '',
        updateTime: '',
        permissionList: permissionList.value,
      }

      request('/api/role/update', 'POST', UpDate).then(
        (res) => {
          updateDialogVisible.value = false;
          fnRoleList()
        },
      )

    }
    //关联权限
    const updateJurisdiction = ref([])
    const inputJurisdiction = ref([])
    const name = ref({})
    const fnPower = () => {
      request('/api/permission/list', 'POST', {}).then(
          (res) => {
            updateJurisdiction.value = res.data;
            inputJurisdiction.value = res.data;
            console.log(updateJurisdiction.value)
          },
      )
    }
    //角色权限关联

    //输入框中获取当前选中的信息
    const allRoleMessage = ref({})
    const updateRoleMessage = () => {
      selection.value.forEach((z: Role) => {
        rName.value = z.rName;
        remark.value = z.remark;
        code.value = z.code;
        permissionList.value = z.permissionList
      })
    }
    //查找角色
    const searchRolecode = ref('') //要查找的角色id
    const searchRoleName = ref('')  //要查找的角色名
    const fnRoleSearch = () => {
      request('/api/role/list', 'POST', { code: searchRolecode.value, rName: searchRoleName.value }).then(//method：请求的类型 submitData:
        (res) => {
          tableData.value = res.data;
          searchRolecode.value = '';
          searchRoleName.value = '';
        },
      )
    }
    //格式化时间
    const formatTime = (row, column, cellValue) => {
      if (cellValue) {
        return dayjs(cellValue).format('YYYY-MM-DD')
      } else {
        return '--'
      }
    }
    //点击重置后清空内容
    const Reset = () => {
      searchRolecode.value = '';
      searchRoleName.value = '';
    }
    //关闭弹出框时清除数据
    const closeDialog = () => {
      rName.value = '';
      code.value = '';
      remark.value = '';
      value.value = '';


    }

    return {
      SaverId,
      name,
      gainRid,
      value,
      btUpdate,
      btDelete,
      fnRoleDelete,
      fnRoleInsert,
      fnRoleUpdate,
      updateDialogVisible,
      options,
      tableData,
      remark,
      dialogVisible,
      handleSelectionChange,
      fnRoleList,
      rName,
      rId,
      status,
      createTime,
      updateTime,
      deleteDialogVisible,
      searchRolecode,
      searchRoleName,
      fnRoleSearch,
      deleteRid,
      formatTime,
      code,
      allRoleMessage,
      updateRoleMessage,
      Reset,
      fnPower,
      updateJurisdiction,
      inputJurisdiction,
      addPrSelectValue,
      updatePrSelectValue,
      closeDialog,
      ACCOUNT_STATUS,
      DEL_FLAG,
      permissionList
    }
  },
  created() {
    this.fnRoleList()
  },
  components: {},

})
